
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>注册</title>
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.css" >
	<link rel="stylesheet" href="css/me.css" >
</head>
<body>
	<br />
	<br />
	<div class="m-container-small m-padded-tb-massive" style="max-width: 30em !important;">
		<div class="ui container">
			<div class="ui middle aligned center aligned grid">
				<div class="column">
					<h2 class="ui teal image header">				
						<div class="content">
							用户注册
						</div>
					</h2>
					<form id="app" class="ui large form">
						<div class="ui stacked segment">
							<div class="field">
							  <div class="ui left icon input">
								<i class="user icon"></i>
								<input type="text" name="username" id="username" placeholder="账号">
                                 
							  </div>
							</div>
							<div class="field">
							  <div class="ui left icon input">
								<i class="lock icon"></i>
								<input type="password" name="password" id="password" placeholder="密码">
                                <!--  <label v-if=" password.length==0 " v-text="pmessage"></label>-->
							  </div>
							</div>
							<div class="field">
							  <div class="ui left icon input">
								<i class="lock icon"></i>
								<input type="password" name="password2" id="password2" placeholder="再次密码">                              
							  </div>
							</div>
							<div class="field" style="display:none;" id="msgDiv">
							  <div class="ui left icon input">
                                  <span style="color: red; align-content: center;" id="msg">密码不一致</span>
							  </div>
							</div>
							</div>
							<div onclick="reg()" class="ui fluid large teal submit button">注册</div>
					     <div class="ui message"  style="display:none;" id="loginDiv">
					                      已有账号？ 点击    <a href="login.html">登录</a>
					    </div>
					</form>
				</div>

	           </div>
			</div>

		</div>
	</div>

    <!--	/*/<th:block th:replace="fragment::script">/*/-->
    <script src="js/jquery.min.js"></script>
    <script src="js/semantic.min.js"></script>
    <script src="js/axios.js"></script>
    <!--    /*/</th:block>/*/-->
    
    
    <script type="text/javascript">
    	
       function reg(){
           var username=$("#username").val();
		   var password=$("#password").val();
		   var password2=$("#password2").val();
		   debugger
		   if(password!=password2){
		   	   $("#msg").html("两次密码输入不一致....");
		   	   $("#msgDiv").show();
		   	   return false;
		   }else{
		   	  var values={};
		   	  values.username=username;
		   	  values.password=password;
		   	  axios.post('user/reg',values).then(function (res){
		   	  	  var data=res.data;
		   	  	  debugger
		   	  	  if(data.code==200){
		   	  	  	 window.location.href="login.html";
				  }else{
					  $("#msg").html(data.msg);
					  $("#msgDiv").show();
				  }
			  })
		   }
	   }
    	
    </script>
    
    

</body>
</html>
